<template>
    <div class="form-perfect">
        <div class="body">
            <my-table :data="formList">
                <el-table-column label="资料名称" min-width="160">
                    <template v-slot="{row}">
                        <my-select v-if="!row.guid" v-model="row.infoguid" :data="infoTypes" :props="{value: 'guid', label: 'label_name'}"
                            2way="label_name,label_type,templatevalue,examplevalue" :label_name.sync="row.label_name" :label_type.sync="row.label_type"
                            :templatevalue.sync="row.templatevalue" :examplevalue.sync="row.examplevalue"></my-select>
                        <template v-if="row.guid">
                            {{row.label_name}}
                        </template>
                    </template>
                </el-table-column>

                <el-table-column label="提交内容" min-width="160">
                    <template v-slot="{row}">
                        <template v-if="row.label_type === 'input'">
                            {{row.label_value}}
                        </template>

                        <template v-if="row.label_type === 'file' && row.label_value">
                            <my-upload :file-guid="row.label_value" readonly single></my-upload>
                        </template>
                    </template>
                </el-table-column>

                <el-table-column label="审核状态" width="100">
                    <template v-slot="{row}">
                        <el-tag size="mini" v-if="row.shbj === '1'" type="primary">待完善</el-tag>
                        <el-tag size="mini" v-if="row.shbj === '3'" type="danger">退回</el-tag>
                        <el-tag size="mini" v-if="row.shbj === '9'" type="success">通过</el-tag>
                    </template>
                </el-table-column>
            </my-table>
        </div>

    </div>
</template>

<script>
export default {
    props: {
        data: {
            type: Object,
            default: () => ({}),
        },
    },
    data() {
        return {
            formList: [],

            infoTypes: [],
        };
    },
    methods: {
        addRowHandler() {
            this.formList.push({
                agent_guid: this.data.guid,
                infoguid: '',
                label_name: '',
                label_type: '',
                label_value: '',
                templatevalue: '',
                examplevalue: '',
                shbj: '1',
            });
        },

        initHandler() {
            this.$get(
                `${this.$store.state.api.webUrl}/elecbidding/uploaddetail.json`,
                {
                    guid: this.data.guid,
                },
                (data) => {
                    this.formList = data;
                    // if (!data || !data.length) {
                    //     // 没有内容就设置3个空内容
                    //     this.addRowHandler();
                    //     this.addRowHandler();
                    //     this.addRowHandler();
                    // } else {
                    //     this.formList = data;
                    // }
                }
            );
        },
    },
    mounted() {
        this.initHandler();
    },
};
</script>

<style lang="scss" scoped>
.form-perfect {
    margin-top: -20px;

    .action {
        display: flex;
        align-items: center;

        .left {
            flex: 1;
        }

        .right {
        }
    }

    .body {
        margin: 20px 0;

        .row {
            display: flex;

            .name,
            .type {
                flex: 1;
            }

            .type {
                margin: 0 10px;
            }

            & + .row {
                margin-top: 10px;
            }
        }
    }

    .footer {
        text-align: center;
    }
}
</style>